<extend name="Public/base"/>

<block name="body">
    <div class="main-title">
        <h2>比赛【{$race['title']}】的视频列表 <button class="btn btn-default btn-return" onclick="javascript:history.back(-1);return false;"><i class="glyphicon glyphicon-share-alt"></i> 返 回</button></h2>
    </div>
    <div class="cf">
        <div class="fl">
            <a title="新增" class="btn btn-primary" href="#"><i class="glyphicon glyphicon-plus"></i></a>
            <button class="btn btn-default ajax-post" url="{:U('changeStatus',array('method'=>'resume'))}" target-form="ids"><i class="glyphicon glyphicon-ok-circle"></i> 启 用</button>
            <button class="btn btn-default ajax-post" url="{:U('changeStatus',array('method'=>'forbid'))}" target-form="ids"><i class="glyphicon glyphicon-ban-circle"></i> 禁 用</button>
            <button class="btn ajax-post confirm btn-danger" url="{:U('delVideo', array('race_id'=>$id))}" target-form="ids">删 除</button>
        </div>

    </div>
    <div class="tab-content">
    <notempty name="race.match_videos">
    <form action="" method="post" class="form">
        <div class="data-table table-striped" style="">
        <table class="table table-bordered">
            <thead>
                <tr>
                <th class="row-selected row-selected"><input class="check-all" type="checkbox"/></th>
                <th>视频</th>
                <th width="20%" class="">时间结点 (必须使用 00:00 这样的格式)</th>
                <th class="">操作</th>
                </tr>
            </thead>
        <tbody>
            <volist name="race.match_videos" id="vd">
                <tr>
                    <td><input class="ids" type="checkbox" name="id[]" value="{$vd}" /></td>
                    <td>{$videos[$vd]['full_title']|default=$videos[$vd]['title']|htmlspecialchars_decode} 【{$videos[$vd]['detail']}】</td>
                    <td><input class="text form-control" name="video_times[{$vd}]" value="{$race['match_times'][$key]}" /></td>
                    <td>
                        <a class="btn btn-default btn-xs" title="编辑" href="{:U('Video/edit?race_id='.$id.'&id='.$vd)}"><i class="glyphicon glyphicon-pencil"></i></a>
                        <a class="btn btn-default btn-xs" title="栏目" href="{:U('Video/setTopic?id='.$vd)}"><i class="glyphicon glyphicon-briefcase"></i></a>
                        <a title="上头条" href="{:U('Recommend/add?video_id='.$vd)}" class="btn btn-default btn-xs confirm ajax-get"><i class="glyphicon glyphicon-home"></i></a>
                        <a href="{:U('delVideo?race_id='.$id.'&id='.$vd)}" class="confirm ajax-get btn btn-danger btn-xs"><i class="glyphicon glyphicon-trash"></i></a>
                    </td>
                </tr>
            </volist>
        </tbody>
        </table>
        </div>
        <br><br>
        <div class="form-item form-group form-action">
            <button class="btn submit-btn ajax-post btn-success btn-block" id="submit" onclick="do_submit();" type="submit" target-form="form">确 定 排 序</button>
            <!-- <button class="btn btn-return" onclick="javascript:history.back(-1);return false;">返 回</button> -->
        </div>
    </form>
    <else />
        <div class="form-item">
            <div class="controls">
                <font color="red"><strong>请先在“视频”管理设置比赛所属的视频</strong></font>
            </div>
        </div>
        <br><br>
        <div class="form-item">
            <!-- <button class="btn btn-return" onclick="javascript:history.back(-1);return false;">返 回</button> -->
        </div>
    </notempty>
    </div>
</block>

<block name="script">
    <script type="text/javascript">

         //确认提交前把selected框所有选中
        function do_submit(){
            $('#selected_video').find('option').prop('selected',true);
        }

        //对增加按钮进行事件绑定
        $('.add_em').click( function(){
            var optionType = "#select_video option:selected";
            var selectedType = "#selected_video";
            var selectVal = $("#select_video").val();
            if(selectVal){
                $(optionType).each( function(){
                    $(selectedType).append("<option selected value='"+$(this).val()+"'>"+$(this).text()+"</option");
                });
            }
        });

        //对移除按钮进行事件绑定
        $('.remove_em').click( function(){
            var optionType = "#selected_video option:selected";
            var selectVal = $("#selected_video").val();
            if(selectVal){
                $(optionType).each( function(){
                    $(this).remove();  
                });
            };
        });

        //置顶
        $('.JS_first').click(function(){
            var classType = "#selected_video";
            var optionType = "#selected_video option:selected";
            var selectVal = $(classType).val();
            if(selectVal){
                $(optionType).each( function(){
                    $(classType).prepend("<option selected value='"+$(this).val()+"'>"+$(this).text()+"</option");
                    $(this).remove();  
                });
            };
        });

        //往上
        $('.JS_up').click(function(){
            var optType = "#selected_video option";
            var optSelType = "#selected_video option:selected";
            var selectVal = $("#selected_video").val();
            if(selectVal){
                var index = $(optSelType).eq(0).index() - 1;
                index = index < 0 ? 0 : index;
                $(optSelType).each( function(){
                    $(optType).eq(index).before("<option selected value='"+$(this).val()+"'>"+$(this).text()+"</option");
                    $(this).remove();  
                });
            };
        });

        //往下
        $('.JS_down').click(function(){
            var optType = "#selected_video option";
            var optSelType = "#selected_video option:selected";
            var selectVal = $("#selected_video").val();
            if(selectVal){
                var index = $(optSelType).eq(0).index() + 1,
                    l = $(optType).length - 1;
                index = index > l ? l : index;
                $(optSelType).each( function(){
                    $(optType).eq(index).after("<option selected value='"+$(this).val()+"'>"+$(this).text()+"</option");
                    $(this).remove();  
                });
            };
        });

        //置底
        $('.JS_last').click(function(){
            var classType = "#selected_video";
            var optionType = "#selected_video option:selected";
            var selectVal = $("#selected_video").val();
            if(selectVal){
                $(optionType).each( function(){
                    $(classType).append("<option selected value='"+$(this).val()+"'>"+$(this).text()+"</option");
                    $(this).remove();  
                });
            };
        });

        //导航高亮
        highlight_subnav('{:U('Game/index')}');
        showTab();

    </script>
</block>
